<template>
	<view>
		<view class="top">
			<view class="news-con flex align-center justify-between">
				<view></view>
				<view class="news" @tap="toMyNews">
					<image src="/static/d3.png"></image>
					<view></view>
				</view> 
			</view>
			<view class="my-info-con flex align-center justify-between">
				<view class="my-info flex align-center">
					<image v-if="isShowAvatar" :src="user.avatar"></image>
					<image v-else src="/static/d2.png"></image>
					<view class="my-info-right flex flex-direction">
						<text v-if="isShowExit">{{user.nick_name}}</text>
						<text v-else @click="toBack">未登录</text>
						<!-- #ifdef MP-WEIXIN -->
						<view>
							<text class="lg cuIcon-mobile"></text>
							<text>{{user.mobile}}</text>
						</view>
						<!-- #endif -->
					</view>
				</view>
				<text class="lg text-gray cuIcon-right" @tap="updateInfo"></text>
			</view>
		</view>
		<view class="dataInfor flex">
			<!-- #ifdef MP-WEIXIN -->
			<view class="dataInfor-item flex flex-direction align-center justify-center">
				<view class="text1 flex align-end" @tap="toAccountBalance">
					<text>{{user.amount}}</text>
					<text>元</text>
				</view>
				<text @tap="toAccountBalance">账户余额</text>
			</view>
			<view class="dataInfor-item flex flex-direction align-center justify-center" @tap="toMyCollection">
				<view class="text2 flex align-end">
					<text>{{myCollectCounts}}</text>
					<text>个</text>
				</view>
				<text>收藏</text>
			</view>
			<view class="dataInfor-item flex flex-direction align-center justify-center" @tap='toMyCommission'>
				<view class="text1 flex align-end">
					<text>{{myCommission}}</text>
					<text>元</text>
				</view>
				<text>获得佣金</text>
			</view>
			<!-- #endif -->
			<!-- #ifdef MP-ALIPAY -->
			<view class="dataInfor-item flex flex-direction align-center justify-center" style="width:50%;">
				<view class="text1 flex align-end" @tap="toAccountBalance">
					<text>{{user.amount}}</text>
					<text>元</text>
				</view>
				<text @tap="toAccountBalance">账户余额</text>
			</view>
			<view class="dataInfor-item flex flex-direction align-center justify-center" @tap="toMyCollection" style="width:50%;">
				<view class="text2 flex align-end">
					<text>{{myCollectCounts}}</text>
					<text>个</text>
				</view>
				<text>收藏</text>
			</view>
			<!-- #endif -->
		</view>
		<view class="myOrter flex flex-direction">
			<view class="myOrter-top flex align-center justify-between">
				<text>我的订单</text>
				<view class="flex align-center">
					<text @tap="toMyOrder(1)">查看全部订单</text>
					<text class="lg text-gray cuIcon-right" @tap="toMyOrder(1)"></text>
				</view>
			</view>
			<view class="myOrter-list flex align-center justify-around">
				<view class="myOrter-item flex align-center justify-center flex-direction" @tap="toMyOrder(2)">
					<image src="/static/d4.png"></image>
					<text>待付款</text>
				</view>
				<view class="myOrter-item flex align-center justify-center flex-direction" @tap="toMyOrder(3)">
					<image src="/static/d5.png"></image>
					<text>待发货</text>
				</view>
				<view class="myOrter-item flex align-center justify-center flex-direction" @tap="toMyOrder(4)">
					<image src="/static/d6.png"></image>
					<text>待收货</text>
				</view>
				<view class="myOrter-item flex align-center justify-center flex-direction" @tap="toMyOrder(5)">
					<image src="/static/d7.png"></image>
					<text>待评价</text>
					<view></view>
				</view>
				<view class="myOrter-item flex align-center justify-center flex-direction" @tap="toMyReturn">
					<image src="/static/d8.png"></image>
					<text>退换货</text>
				</view>
			</view>
		</view>
		<view class="list flex flex-direction">
			<!-- #ifdef MP-WEIXIN -->
			<view class="item flex align-center justify-between" @tap="toMyInvitationLink">
				<view class="flex align-center">
					<image src="/static/d9.png"></image>
					<text>我的邀请码</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
			
			<view class="item flex align-center justify-between" @tap="toPersonList">
				<view class="flex align-center">
					<image src="/static/d10.png"></image>
					<text>我的团队</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
			<!-- #endif -->
			<view class="item flex align-center justify-between" @tap="toMyCollection">
				<view class="flex align-center">
					<image src="/static/d11.png"></image>
					<text>我的收藏</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view>
			<!-- <view @click="allEvaluation" class="item flex align-center justify-between">
				<view class="flex align-center">
					<image src="/static/d11.png"></image>
					<text>我的评论</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view> -->
			<!-- <view @click="myAdvice" class="item flex align-center justify-between">
				<view class="flex align-center">
					<image src="/static/d11.png"></image>
					<text>我的咨询</text>
				</view>
				<text class="lg text-gray cuIcon-right"></text>
			</view> -->
			<!-- <view @click="toBack" class="item flex align-center justify-between">
				<view class="flex align-center">
					<image src="/static/d11.png"></image>
					<text>退出登陆</text>
				</view> 
				<text class="lg text-gray cuIcon-right"></text>
			</view> -->
			<view v-if="isShowExit" class="item flex align-center justify-between logout" @tap="toBack">
				<view class="ext flex align-center justify-between">
					<button class="flex align-center justify-center">
						<text class="text-white">退出</text>
				 </button>
				</view>
			</view>
			
		</view>
	</view>
</template>

<script>
	var api = require('@/components/api.js');
	export default {
		data() {
			return {
				user: '',
				isShowAvatar:false,
				myCommission: '',
				myCollectCounts: '',
				isShowExit:false,
				wxuserinfo:{}
			}
		},
		onShow() {
			this.loadUser()
			if(this.user !=''&& this.user.user_id){
				this.loadCommission()
				this.loadCollectCounts()
			}
		},
		onLoad() {
			let that = this;
			uni.login({
				provider:'weixin',
				success:function(loginRes) {
				// 获取用户信息
					uni.getUserInfo({
						provider:'weixin',
						success:function(infoRes){
							that.wxuserinfo = infoRes.userInfo
							console.log('vvv',that.wxuserinfo)
						}
					});
				}
			});
			this.loadUser()
			if(this.user !=''&& this.user.user_id){
				this.loadCommission()
				this.loadCollectCounts()
			}
			console.log(this.user.avatar)
		},
		methods: {
			loadUser: function() {
				try {
					this.user = uni.getStorageSync('user');
					console
					if(this.user.avatar&&this.user.avatar.indexOf('http')>=0&&(this.user.avatar.indexOf('.jpg')>=0||this.user.avatar.indexOf('.png')>=0)){
						this.isShowAvatar = true
					}
					if(this.user.avatar&&this.user.avatar.indexOf('https')>=0){
						this.isShowAvatar = true
					}
					if (this.user == '' || !this.user.user_id) {
						this.isShowExit = false
					}else{
						this.isShowExit = true
					}
					console.log(this.user);
				} catch (e) {
				}
			},
			judgeLoadUser: function() {
				try {
					this.user = uni.getStorageSync('user');
					console.log('judgeLoadUser'+JSON.stringify(this.user) );
					if (this.user == '' || !this.user.user_id) {
							console.log('judgeLoadUser 1'+JSON.stringify(this.user) );
						uni.navigateTo({
							url: '/pages/login/login'
						});
						return
					}
				} catch (e) {
					uni.showModal({
						title: '提示',
						content: '账号超时，请重新登陆',
						success: (res) => {
							if (res.confirm) {
								uni.navigateTo({
									url: '/pages/login/login'
								});
							}
						}
					});
				}
			},
			loadCommission: function() {
				api.get({
					url: 'Amount/GetCommission',
					data: {
						user_id: this.user.user_id
					},
					success: data => {
						console.log(data)
						if (data.ErrCode == 0) {
							this.myCommission = data.Response
						}
					}
				});
			},
			loadCollectCounts: function() {
				api.get({
					url: 'User/GetCollectCounts',
					data: {
						user_id: this.user.user_id
					},
					success: data => {
						console.log(data)
						if (data.ErrCode == 0) {
							this.myCollectCounts = data.Response
						}
					}
				});
			},
			updateInfo: function() {
				if (this.user == '' || !this.user.user_id) {
						console.log('judgeLoadUser 1'+JSON.stringify(this.user) );
					uni.navigateTo({
						url: '/pages/login/login'
					});
					return
				}
				
				uni.navigateTo({
					url: '/module/my/myInfor/myInfor'
				});
			},
			/**
			 * 我的收藏
			 * **/
			toMyCollection: function() {
				if (this.user == '' || !this.user.user_id) {
						console.log('judgeLoadUser 1'+JSON.stringify(this.user) );
					uni.navigateTo({
						url: '/pages/login/login'
					});
					return
				}
				uni.navigateTo({
					url: '/module/my/myCollection/myCollection'
				});
			},
			/**
			 * 订单
			 * **/
			toMyOrder: function(type) {
				if (this.user == '' || !this.user.user_id) {
						console.log('judgeLoadUser 1'+JSON.stringify(this.user) );
					uni.navigateTo({
						url: '/pages/login/login'
					});
					return
				}
				uni.navigateTo({
					url: '/module/my/myOrder/myOrder?type=' + type
				});
			},
			/**
			 * 退换货
			 * **/
			toMyReturn: function() {
				if (this.user == '' || !this.user.user_id) {
						console.log('judgeLoadUser 1'+JSON.stringify(this.user) );
					uni.navigateTo({
						url: '/pages/login/login'
					});
					return
				}
				uni.navigateTo({
					url: '/module/my/myReturn/myReturn'
				});
			},
			/**
			 * 我的邀请码
			 * **/
			toMyInvitationLink: function() {
				if (this.user == '' || !this.user.user_id) {
						console.log('judgeLoadUser 1'+JSON.stringify(this.user) );
					uni.navigateTo({
						url: '/pages/login/login'
					});
					return
				}
				uni.navigateTo({
					url: '/module/my/myInvitationLink/myInvitationLink'
					// url: '/pages/mylink/mylink'
				});
			},
			/**
			 * 我的团队
			 * **/
			toPersonList: function() {
				if (this.user == '' || !this.user.user_id) {
						console.log('judgeLoadUser 1'+JSON.stringify(this.user) );
					uni.navigateTo({
						url: '/pages/login/login'
					});
					return
				}
				uni.navigateTo({
					url: '/pages/personList/personList'
				});
			},
			/**
			 * 我的消息
			 * **/
			toMyNews: function() {
				if (this.user == '' || !this.user.user_id) {
						console.log('judgeLoadUser 1'+JSON.stringify(this.user) );
					uni.navigateTo({
						url: '/pages/login/login'
					});
					return
				}
				uni.navigateTo({
					url: '/module/my/myNews/myNews'
				});
			},
			/**
			 * 我的佣金
			 * **/
			toMyCommission: function() {
				if (this.user == '' || !this.user.user_id) {
						console.log('judgeLoadUser 1'+JSON.stringify(this.user) );
					uni.navigateTo({
						url: '/pages/login/login'
					});
					return
				}
				uni.navigateTo({
					url: '/module/my/myCommission/myCommission?key='+this.myCommission
				});
			},
			/**
			 * 账号余额
			 * **/
			toAccountBalance: function() {
				if (this.user == '' || !this.user.user_id) {
						console.log('judgeLoadUser 1'+JSON.stringify(this.user) );
					uni.navigateTo({
						url: '/pages/login/login'
					});
					return
				}
				uni.navigateTo({
					url: '/pages/accountBalance/accountBalance'
				});
			},
			allEvaluation(){
				uni.navigateTo({
					url: "/module/my/myEvaluation/myEvaluation"
				})
			},
			myAdvice(){
				uni.navigateTo({
					url: "/module/my/myAdvice/myAdvice"
				})
			},
			toBack(){
				uni.setStorageSync('user','')
				this.isShowExit = false
				uni.navigateTo({
					url: "/pages/login/login"
				})
				
			},

		}
	}
</script>

<style lang="scss" scoped>
	.logout{
		position: absolute;
		bottom:10rpx;
	}
	.ext button {
		width: 660upx;
		height: 70upx;
		margin-left: 8%;
		background-color: $btn-bground;
		border-radius: 35upx;
		padding: 0;
	}
	.item>view>text {
		font-size: 28upx;
		color: #000000;
		margin-left: 20upx;
	}

	.list {
		margin-top: 20upx;
	}

	.item>view>image {
		width: 36upx;
		height: 36upx;
	}

	.item>view>text {
		font-size: 28upx;
		color: #000000;
	}

	.item {
		height: 87upx;
		padding: 0 20upx;
		width: 100%;
		background-color: #fff;
		border-bottom: 1upx solid #fff;
	}

	.myOrter-item {
		position: relative;
	}

	.myOrter-item view {
		width: 14upx;
		height: 14upx;
		position: absolute;
		right: 8upx;
		top: 0;
		background-color: #ea0000;
		border-radius: 50%;
	}

	.myOrter-list {
		width: 100%;
		height: 128upx;
	}

	.myOrter-item image {
		width: 47upx;
		height: 42upx;
	}

	.myOrter-item text {
		font-size: 22upx;
		color: #666666;
		margin-top: 16upx;
	}

	.myOrter-top>view>text:nth-child(1) {
		font-size: 24upx;
		color: #999999;
	}

	.myOrter-top {
		padding: 0 20upx;
		border-bottom: 1upx solid #ddd;
		height: 80upx;
	}

	.myOrter {
		margin-top: 20upx;
		background-color: #fff;
	}

	.dataInfor-item>text {
		font-size: 24upx;
		color: #666666;
		margin-top: 10upx;
	}

	.text2>text:nth-child(1) {
		font-size: 32upx;
		color: #3a8cf0;
		font-weight: 500;
	}

	.text2>text:nth-child(2) {
		font-size: 22upx;
		color: #3a8cf0;
	}

	.text1>text:nth-child(1) {
		font-size: 32upx;
		color: #e99532;
		font-weight: 500;
	}

	.text1>text:nth-child(2) {
		font-size: 22upx;
		color: #e99532;
	}

	.dataInfor-item {
		background-color: #fff;
		width: 250upx;
		height: 130upx;
		border-right: 1upx solid #ddd;
	}

	.my-info-con {
		margin-top: 50upx;
	}

	.my-info-con>text {
		color: #fff;
	}

	.my-info-right {
		margin-left: 20upx;
	}

	.my-info-right>text {
		font-size: 28upx;
		color: #ffffff;
		margin-bottom: 10upx;
	}

	.my-info-right>view>text {
		font-size: 24upx;
		color: #ffffff;
		margin-right: 6upx;
	}

	.my-info image {
		width: 114upx;
		height: 114upx;
		border-radius: 50%;
		border: 2upx solid #d5a5d5;
	}

	.news-con {
		padding-top: 60upx;
	}

	.news {
		position: relative;
	}

	.news image,
	.news {
		width: 38upx;
		height: 34upx;
	}

	.news>view {
		position: absolute;
		right: 0;
		top: 0;
		background-color: #ea0000;
		width: 14upx;
		height: 14upx;
		border-radius: 50%;
	}

	.top {
		background: #fc6520;
		padding: 0 20upx;
		width: 100%;
		height: 380upx;
		background-repeat: no-repeat;
		background-size: 100% 100%;
	}
</style>
